<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:replace="~{commons/public1::common-public}">
    <meta charset="UTF-8">
    <link rel="stylesheet"
          href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"
          integrity="sha512-SfTiTlX6kk+qitfevl/7LibUOeJWlt9rbyDn92a1DqWOw9vWG2MFoays0sgObmWazO5BQPiFucnnEAjpAB+/Sw=="
          crossorigin="anonymous" referrerpolicy="no-referrer"/>

    <meta charset="utf-8">
    <title></title>
</head>
<style>
    .ifooter {
        width: 1111px;
        margin: auto;
        margin-left: 90px;
        margin-top: 20px;
    }

    .all {
        width: 100%;
        height: 810px;
        padding-bottom: 50px;
        margin-top: -80px;
        margin-bottom: 1px;
    }

    .all .content {
        margin-top: 0px;
        float: left;
    }

    .all iframe {
        /* border: 2px solid red; */

    }

    .img {
        float: left;
        margin-left: 20px;
    }

    #content {
        /* 	border: 1px solid red; */
        width: 1200px;
        margin-top: -80px;
        margin: auto;
    }

    #content .a1 {
        float: left;
        margin-left: 10px;
    }

    #content .a1 .big {
        /* float: left; */
        width: 450px;
        height: 400px;
    }

    #content .a11 ul li {
        list-style: none;
        float: left;
        margin: 20px 15px;
    }

    .a11 ul li img {
        border: 3px white solid;
        width: 80px;
        height: 80px;
    }

    .a11 ul li img:hover {
        border: 3px #FF4F0D solid;
    }

    .a2 {
        float: left;
        margin-left: 90px;
    }

    .a2 a {
        text-decoration: none;
    }

    .a2 h2 {
        color: #000000;
    }

    .a21 .a211 {
        background-color: #758188;
        color: #758188;
    }

    .a21 .a211 .prices, .shic {
        margin-left: 40px;
    }

    .a21 .a211 .prices {
        color: #FF4F0D;
        font-size: 35px;
        font-weight: bold;
    }

    .a21 .a211 span {
        color: #111314;
    }

    .a21 .a211 .yis {
        margin-left: 230px;
    }

    .a22 span, p {
        margin-top: 10px;
        color: #111314;
    }

    .a22 .neir {
        margin-left: 50px;
    }

    .a23 {
        margin-top: 10px;
    }

    .a24 {
        margin-top: 10px;
    }

    .a24 .bang {
        display: inline-block;
        border: 3px #EDF0F5 solid;
        width: 50px;
        line-height: 40px;
        margin-left: 30px;
        text-align: center;
    }

    .a24 .bang:hover {
        border: 3px #FF4F0D solid;
    }

    .a25 {
        margin-top: 30px;
    }

    .a25 button {
        display: inline-block;
        width: 200px;
        height: 60px;
        border-radius: 30px;
        margin-left: 30px;
        float: left;
    }

    .a25 .a25color1 {
        background-color: #FFEEE8;
        color: #FF4F0D;
        font-size: 20px;
        font-weight: bolder;
        border: 1px #FF4F0D solid;
    }

    .a25 .a25color2 {
        background-color: #FF4F0D;
        color: white;
        font-size: 20px;
        font-weight: bolder;
        border: 1px #FF4F0D solid;
    }

    .imgd {
        width: 131px;
        margin-top: 50px;
    }
</style>
<body>
<header th:replace="~{commons/header1::common-header}"></header>
<div id="all">

    <div class="img" style="clear: both;">
        <img class="imgd" th:src="${novel.image}">
    </div>
    <div id="content">
        <div class="a2">
            <h2 th:text="${novel.novelname}"></h2>
            <div class="a21">
                <div class="a211">
                    <span class="color">作者</span> <span class="prices"
                                                          th:text="${novel.author}"></span> <span class="shic">状态<span
                        class="prices2" th:text="${novel.state}"></span></span> <span
                        class="yis">收藏6264次</span>
                </div>
                <div class="a22">
                    <p></p>
                    <span class="color">简介:</span> <span
                        class="neir" th:text="${novel.introduction}"></span>
                    <p></p>
                    <span class="color">类型:</span> <span class="neir"
                                                           th:text="${novel.noveltype}"></span>
                    <div class="a25">
                        <a th:href="@{/content/getchapter(novelname=${novel.novelname})}">
                            <button
                                    class="a25color1">开始阅读
                            </button>
                        </a>
                        <form class="layui-form" th:action="@{/novel/addbook}" method="post">
                            <input type="hidden" name="userName" th:value="${session.shelf}">
                            <input type="hidden" name="novelname" th:field="${novel.novelname}">
                            <button th:if="${isShow==true}" class="a25color2">加入书架</button>
                        </form>
                    </div>
                </div>
            </div>
        </div>
        <iframe class="ifooter" name="fooster" th:src="@{/chapter/getchapterlist(novelname=${novel.novelname})}" frameborder="0"></iframe>
    </div>
</body>
</html>